<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <h1>The Jquery Ajax 01 Page</h1>
    <button onclick="doAjax()">$.ajax(...)</button>
    <button onclick="doAjaxPost()">$.POST(...)</button>
    <button onclick="doAjaxGet()">$.GET(...)</button>
    <button onclick="doAjaxLoad()">$("..").load(...)</button>
    <div id="result"></div>
    <script src="/js/jquery.min.js"></script>
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
    <script>

        function doAjaxLoad() {
            let url="http://localhost:8080/doAjaxGet";
            let params="";
            //$("#result").load(url,params);
            $("#result").load(url,params,function () {
                console.log("load finish");
            });
        }

        //简化形式
        function doAjaxGet() {
            let url="http://localhost:8080/doAjaxGet";
            let params="";
            $.get(url,params,function (result) {
               // $("#result").html(JSON.stringify(result));
                $("#result").html(result);
            },"text")//text 表示服务端响应到客户端的数据类型
                    //假如是json,客户端会将其转换为json格式的js对象
        }

        function doAjax(){
            let url="http://localhost:8080/doAjaxGet";
            let params="";
            $.ajax({
                type:"GET",
                url:url,
                data:params,
                async:true,
                success:function (result) {
                   // document.getElementById("result").innerHTML=result
                    console.log(result);
                }
            })

        }

        function doAjaxPost() {
            let url="http://localhost:8080/doAjaxPost";
            let params="id=101&name=book&remark=books..";
           /* $.ajax({
                type:"POST",
                url:url,
                data:params,
                async:true,
                success:function (result) {
                    console.log(result);
                }
            })*/
            $.post(url,function (result) {
               // document.getElementById("result").innerHTML=result;
                $("#result").html(result);
            })
        }

    </script>
</body>
</html>